<template>
	<view :style="skin" class="content faultReporting">
		<view class="listMain">
			<view class="overdueList overdueInfo">
				<view class="overdueListLeft">
					<u--image shape="circle" :src="src" width="75px" height="75px"></u--image>
				</view>
				<view class="overdueListRight">
					<view class="rightTips" @click="sheetTypeShow = true">
						{{$t('lease.productModel')}}: {{obj.productModel}}
						<text class="iconfont icon-a-mingchengarrow_down icondown"></text>
					</view>
					<view class="rightTips" @click="handleViewDevice">
						{{$t('lease.productID')}}: {{obj.productId}}
						<text class="iconfont icon-a-mingchengarrow_down icondown"></text>
					</view>
					<view class="rightTips">
						{{$t('property.loser')}}: {{nickname}}
					</view>
					<!-- <view class="rightTips">
						{{$t('property.reasonLoss')}}: 理由
					</view> -->
					<view class="rightTips">
						{{$t('property.lossDate')}}: {{getNewDate}}
					</view>
					<view class="rightTips deduct">
						{{$t('property.lossdeMo')}}: {{moneyTran(agencySecurityDeposit)}}MWK
					</view>
				</view>
			</view>

			<view class="mt16">
				{{$t('property.reasonLoss')}}:
				<u--textarea v-model="obj.lostReason" :placeholder="$t('lease.pleEnter')" count></u--textarea>
			</view>

			<view class="footerBtn">
				<u-button @click="handleLost" color="var(--subjectColor)">{{$t('property.confirmLoss')}}
				</u-button>
			</view>
		</view>

		<!-- 设备 -->
		<u-action-sheet @close="sheetShow = false" @select="selectDevice" cancelText="Cancel" :actions="deviceList"
			:show="sheetShow"></u-action-sheet>
		<!-- 类型 -->
		<u-action-sheet @close="sheetTypeShow = false" @select="selectDeviceType" cancelText="Cancel"
			:actions="deviceTypeList" :show="sheetTypeShow"></u-action-sheet>


	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	import {
		addDevice,
		getNoLostList,

	} from '@/utils/sql/sqlDevice.js'
	import {
		getDeviceType,
		addDeviceType,
		getDevModel,
		reduceInsoter,
		reduceTenantable,
	} from '@/utils/sql/sqlDeviceType.js'
	import {
		getNewYMD
	} from '@/utils/index.js'
	import {
		leaPid,
		leaNoStore
	} from '@/utils/sql/sqllease.js'
	import {
		lostReport,
		pageStockLost,
		lostBack
	} from '@/api/leaProductLost.js'
	import {
		getPriceTypeToId
	} from '@/utils/sql/sqlPrice.js'
	import {
		addLease
	} from '@/utils/sql/sqllease.js'

	export default {
		data() {
			return {
				deviceTypeList: [],
				sheetTypeShow: false,
				src: '',
				loseStatus: 'lose',
				loseInfoShow: true,
				sheetShow: false,
				deviceList: [],
				obj: {},

				lostList: [],

				lostBackObj: {

				},
				lostUnReason: '',
				agencySecurityDeposit: '',
				nickname: '', //丢失人
				actionDeviceType: {},

				appearObj: null, //盘点转丢失的数据
			}
		},
		onLoad(options) {
			if (options.appearObj) {
				let appearObj = JSON.parse(options.appearObj)
				this.obj.productId = appearObj.productId
				this.obj.productModel = appearObj.productModel
				console.log(appearObj);
				getDevModel(appearObj.productModel).then(res => {
					if (res.code == 0) {
						this.actionDeviceType = res.data[0]
					}
				})
				getPriceTypeToId(appearObj.productModel).then(res => {
					console.log(res);
					if (res.code == 0 && res.data.length > 0) {
						this.agencySecurityDeposit = res.data[0].agencySecurityDeposit
					} else {
						this.agencySecurityDeposit = '0'
					}
				})
			}
			this.getTypeList()
		},
		methods: {
			moneyTran(m) {
				console.log(m);
				return (m / 100).toFixed(2)
			},
			goback() {
				uni.navigateBack()
			},
			handleViewDevice() {
				let that = this
				if (this.deviceList.length == 0) {
					uni.showToast({
						title: that.$t('lease.NoDevicesModel'),
						icon: 'none'
					})
					return false
				}
				this.sheetShow = true

			},
			getTypeList() {
				getDeviceType().then(res => {
					console.log(res);
					res.data.map(item => {
						return item.name = item.productModel
					})

					this.deviceTypeList = res.data
				})
			},
			getDeviceList(productModel) {
				getNoLostList(productModel).then(res => {
					console.log(res);
					if (res.data.length > 0) {
						res.data.map(item => {
							return item.name = item.productId
						})
						this.deviceList = res.data
					}


				})
			},
			selectDeviceType(item) {
				console.log(item);
				this.actionDeviceType = item


				this.obj.productModel = item.productModel
				this.obj.productId = ''
				this.nickname = ''
				this.deviceList = []
				this.getDeviceList(item.productModel)
				getPriceTypeToId(item.productModel).then(res => {
					console.log(res);
					if (res.code == 0 && res.data.length > 0) {
						this.agencySecurityDeposit = res.data[0].agencySecurityDeposit
					} else {
						this.agencySecurityDeposit = '0'
					}
				})
			},
			selectDevice(item) {
				console.log(item);
				this.obj.productId = item.productId
				leaNoStore(item.productId).then(res => {
					console.log(res);
					if (res.code == 0 && res.data.length > 0) {
						this.obj.lostCustomerAccount = res.data[0].customerAccount
						this.nickname = res.data[0].nickname
						this.obj.leaseId = res.data[0].leaseId
					} else {
						this.obj.lostCustomerAccount = ''
						this.nickname = ''
						this.obj.leaseId = ''
					}
				})
			},
			handleLost() {
				let that = this


				uni.showLoading({
					title: 'Waiting'
				})

				lostReport({
					productModel: this.obj.productModel,
					productId: this.obj.productId,
					lostCustomerAccount: this.obj.lostCustomerAccount,
					lostReason: this.obj.lostReason,
				}).then(async res => {
					console.log(res);
					uni.hideLoading()
					if (res.code == 0) {
						uni.showToast({
							title: 'Report successfully'
						})
						

						// 调试
						if (this.obj.leaseId) { //丢失的是租赁的设备，将状态改为leaseStatus 丢失 4
							console.log(this.obj);
							let obj = {
								leaseId: this.obj.leaseId,
								leaseStatus: 8,
								iSync: 0
							}
							await addLease(obj)
						} else {
						await	reduceInsoter(this.obj.productModel);
						await	reduceTenantable(this.obj.productModel);
						}
						let obj = {
							productId: this.obj.productId,
							stockStatus: 8,
						
						}
						addDevice(obj).then(rrs =>{
							uni.$emit('lostBack')
							that.goback()
						})
						
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
		},
		computed: {
			...mapState({
				skin: state => state.theme.skin
			}),
			getNewDate() {
				return getNewYMD()
			},
		},
	}
</script>

<style lang="scss" scoped>
	.listMain {
		height: calc(100% - 60px);
		overflow-y: auto;
		padding: 16px;
		box-sizing: border-box;

		.footerBtn {
			position: absolute;
			bottom: 16px;
			width: calc(100% - 32px);
		}

		.title {
			width: 100%;
			height: 55px;
			background-color: #4080FF;
			text-align: center;
			line-height: 62px;
			margin-bottom: 16px;
			color: #fff;
			border-radius: 8px;
			position: relative;

			.iconLeft {
				position: absolute;
				left: 0;
				top: 50%;
				transform: translate(0%, -50%);
			}
		}
	}

	.overdueList {
		width: 100%;
		padding: 16px 0;
		box-sizing: border-box;
		height: 180px;
		display: flex;
		background-color: #fff;
		border: 1px solid #ccc;
		margin-bottom: 8px;

		.overdueListLeft {
			width: 102px;
			height: calc(100% - 16px);
			margin-top: 8px;
			border-right: 1px solid #ccc;
			display: flex;
			flex-direction: column;
			align-items: center;

			.leftTips {
				width: 96px;

			}
		}

		.overdueListRight {
			font-size: 14px;
			color: #101010;
			padding-left: 16px;
			box-sizing: border-box;

			.rightTips {
				line-height: 22px;

				.iconRight {
					// float: right;
				}

				.icondown {
					float: right;
				}
			}

			.deduct {
				color: #BD3124;
			}

			.giveBack {
				color: #81B337;
			}
		}
	}

	.overdueInfo {
		height: 140px;
		margin-bottom: 16px;
	}

	.overdueBack {
		height: 160px;
		margin-bottom: 16px;
	}

	.confir {
		width: 100%;
		margin: 16px auto 0;
		height: 48px;
		display: flex;
		align-items: center;
		justify-content: space-evenly;
	}
</style>